/**
 * 验证规则==正则表达式
 */
let reg = [
    /^[a-zA-Z][a-zA-Z0-9]{5,11}$/, //6-12字母开始,后面跟数字或者字母
    /^1[3-9]\d{9}$/, //手机号
    /^\d{4}$/, //4位数字验证码
    /^\w{6,12}$/ //6-12密码: 数字字母下划线
]

/**
 * input输入框的clear按钮
 * 
 */
$('.ipt').addEventListener('input', function() {
    if (this.value.length > 0) {
        $('.reg-item img').style.display = 'block';
    } else {
        $('.reg-item img').style.display = 'none';
    }
})
$('.ipt1').addEventListener('input', function() {
    if (this.value.length > 0) {
        $('.reg-item .img1').style.display = 'block';
    } else {
        $('.reg-item .img1').style.display = 'none';
    }
})
$('.ipt2').addEventListener('input', function() {
    if (this.value.length > 0) {
        $('.reg-item .img2').style.display = 'block';
    } else {
        $('.reg-item .img2').style.display = 'none';
    }
})
$('.ipt3').addEventListener('input', function() {
    if (this.value.length > 0) {
        $('.reg-item .img3').style.display = 'block';
    } else {
        $('.reg-item .img3').style.display = 'none';
    }
})


//点击删除按钮，清空输入框，隐藏按钮
$('.reg-item img').addEventListener('click', function() {
    $('.ipt').value = '';
    this.style.display = 'none';
})
$('.reg-item .img1').addEventListener('click', function() {
    $('.ipt1').value = '';
    this.style.display = 'none';
})
$('.reg-item .img2').addEventListener('click', function() {
    $('.ipt2').value = '';
    this.style.display = 'none';
})
$('.reg-item .img3').addEventListener('click', function() {
    $('.ipt3').value = '';
    this.style.display = 'none';
})

// 失焦事件
$a('.inp').forEach(function(v, i) {
    // console.log(value);
    // console.log(i);
    v.addEventListener('blur', function() {
        // console.log(1);
        if (reg[i].test(v.value)) {
            //正确情况
            $a('.error-cont')[i].style.display = 'none';
        } else {
            //错误情况
            $a('.error-cont')[i].style.display = 'block';
        }
    })
})

//取消禁用
$('.check').addEventListener('change', function() {
    $('.btn').disabled = !this.checked;
    $('.btn').style.background = this.checked ? ' deepskyblue' : '';
    $('.btn').style.color = this.checked ? '#fff' : '';
    $('.btn').style.cursor = this.checked ? 'pointer' : '';
})


//点击提交按钮验证，只验证错误的，全部成功就跳转到登录页面
$('.btn').addEventListener('click', function() {
    // 遍历正则数组
    for (let i = 0; i < reg.length; i++) {
        //验证输入的信息是否与正则一致
        let bool = reg[i].test($a('.inp')[i].value);

        //只验证失败的
        if (!bool) {
            $a('.error-cont')[i].style.display = 'block';

            //结束函数阻止跳转
            return;
        }
    }
    //全部验证成功跳转到登录页面
    location.href = '../login/login.html';
})